.WebhookViewer {
    position: relative;
    display: flex;
    flex-direction: column;
    margin: 10px 13px 21px;

    .Delivered {
        font-size: 0.6875rem;
        font-weight: 600;
        margin-bottom: 0.5rem;
        color: #38404E;
    }

    .RecordList {
        position: relative;
        display: flex;
        flex-direction: column;

        .RecordListItem {
            background-color: #FFFFFF;
            border-bottom: 2px solid $curtain-color;

            .RecordListItemInfo {
                padding: 10px;
                display: flex;
                flex-direction: row;
                align-content: center;

                i {
                    font-size: 1rem;
                    position: relative;
                }

                i.icon-dis-check {
                    color: $green;
                    margin-right: 10px;
                }

                i.icon-dis-alert {
                    color: $red;
                    margin-right: 10px;
                }

                i.icon-dis-alert.Warning {
                    color: $yellow;
                    margin-right: 10px;
                }

                i.icon-dis-expand, i.icon-dis-collapse {
                    color: $light-blue;
                    margin-left: auto;
                }

                .Url {
                    flex: 0.7;
                    margin-right: 14px;
                    color: $light-blue;
                    font-size: 0.75rem;
                }

                .Id {
                    flex: 1;
                    color: $light-blue;
                    font-size: 0.75rem;
                }

                .Time {
                    flex: 0.5;
                    color: $light-blue;
                    font-size: 0.75rem;
                }

                &:hover {
                    cursor: pointer;
                }
            }
        }
    }
}